<template>
	<view class="bs-works-list-show">
		<title title="作品展示" :showLine='true' :lineShow='true'></title>
		<view class="works-list" v-if="list.length!=0">
			<view class="item" v-for="(item,index) in list">
				<view class="title">
					{{item.title||''}}
				</view>
				<view v-if="item.img.length!=0&&item.img">

					<u-swiper name='url' @click='handClickSw($event,index)' bg-color='#fff' effect3d-previous-margin='100' :effect3d='index%2!=0'
					 mode='dot' :list="item.img" :title='true' indicator-pos='bottomCenter' :height='index%2==0?"390":"240"'></u-swiper>
				</view>
				<view class="content">
					{{item.text||''}}
				</view>
			</view>
		</view>
		<u-empty margin-top='20' font-size='24' icon-size='80' :show='list.length==0' :text="onMsg"></u-empty>
		<u-divider margin-top='30' margin-bottom='30'>到底了~</u-divider>
	</view>
</template>

<script>
	import title from '@/components/bs-title/bs-title.vue'
	export default {
		components: {
			title
		},
		props: {
			onMsg: {
				type: String,
				default: '暂无个人作品'
			},
			list: {
				type: Array,
				default: () => []
			}
		},
		data() {
			return {};
		},
		methods: {
			handClickSw(index, item) {
				let newListImg = []
				this.list[item].img.forEach(eleTow => {
					newListImg.push(eleTow.url)
				})
				uni.previewImage({
					current: index, //预览图片的下标
					urls: newListImg //预览图片的地址，必须要数组形式，如果不是数组形式就转换成数组形式就可以
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.bs-works-list-show {
		.works-list {
			.item {
				margin-top: 50rpx;

				.content {
					color: #666;
					font-size: 32rpx;
					margin-top: 60rpx;
				}

				.title {
					text-align: center;
					font-size: $bs-font-size-32;
					color: $bs-text-color-333;
					margin-bottom: 30rpx;
					font-weight: bold;
				}
			}
		}
	}
</style>
